iT邦幫忙

2024 iThome 鐵人賽

DAY 5
0

陣列 (array) 是一個有索引值( index )的序列,索引值可以想成是順序,陣列中可以儲存不限數量的值,和物件( object )同樣非常常用到,以下是範例 :

const a = [ 1 , 2, 3 ] ;

我將a這個變數放了一個陣列,裡面放了1、2、3,3個數字,假如說我們今天要取得1這個數字的話,會用 a [ 0 ]來取得,比較特別的是,0就是第一個的意思,那如果說要取得2這個數字呢 ? 就是要用 a [ 1 ]來取得。

那如果要更改呢 ? 可以用 :

a [ 0 ] = 2 ; 

這樣a這個陣列就會變成 [ 2 , 2 ,3 ],如果要新增的話,以下為範例 :

a [ 3 ] = 4 ;

這樣a陣列裡面就有4個數字了,分別是1、2、3、4

還有一個很常用的就是陣列的長度,寫法是 a.length

像a這個陣列有3個數字,所以a.length 就是3,常用於條件判斷,後面會再介紹。

接下來要介紹是陣列的方法,用於增/刪/修改/過濾,因為太多種類了,我只能講一下我常用的幾種方法 :

filter : 共有三個參數可以傳入,後面兩個是選擇性使用(optional),第一個是當前元素,第二個是索引值(index),第三個是呼叫的整個陣列,特性是用來過濾所有匹配的值,會產生新的陣列,假設我要從上面例子 a 過濾出大於2的數字,可以用 :

const b = a.filter((item) ⇒ item > 2) ;

這個時候會產生新的陣列,所以a裡面還是3個數字,1、2、3、4,而b裡面因為是從a中選出大於2的數字,因此裡面會只剩3、4這兩個數字了。

find :共有三個參數可以傳入,後面兩個是選擇性使用(optional),第一個是當前元素,第二個是索引值(index),第三個是呼叫的整個陣列,特性是會回傳第一個匹配的值,假設我要從上面例子 a 過濾出大於2的數字,可以用 :

a.find((item) ⇒ item > 2);

傳的值是3,不同於filter會回傳所有匹配的值,find 只會回傳第一個匹配的值。

map : 共有三個參數可以傳入,後面兩個是選擇性使用(optional),第一個是當前元素,第二個是索引值(index),第三個是呼叫的整個陣列,特性是會產生一個滿足你條件的新陣列,假設我們今天要把 a陣列裡的數字都乘以2,可以用 :

const c = a.map((item) ⇒ item * 2);

這樣c就會一樣是四個數字,但數字分別是2、4、6、8

今天先到這邊,明天繼續介紹一些我常用的陣列方法。


上一篇
第四天 - - JavaScript 變數及常數
下一篇
第六天 - - JavaScript 陣列 ( 2 )
系列文
跟著鱷魚妹妹一起坐牢之JavaScript 30天17
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言